<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>抽象工厂模式</title>
  </head>
  <body>
    <script>
      // 模拟抽象类
      class User {
        constructor(name, role, pages) {
          this.name = name;
          this, (role = role);
          this.pages = pages;
        }

        welcome() {
          consoel.log(`welcome back ${this.name}`);
        }

        dataShow() {
          throw Error("Please implement this abstract function first!");
        }
      }

      class SuperAdmin extends User {
        constructor(name) {
          super(name, "superadmin", [
            "home",
            "user-manager",
            "right-manager",
            "page-manager",
          ]);
        }

        dataShow() {
          console.log("This is superAdmain");
        }

        addRight() {}

        addUser() {}
      }

      class Admin extends User {
        constructor(name) {
          super(name, "admin", ["home", "right-manager", "page-manager"]);
        }

        dataShow() {
          console.log("This is admin");
        }

        addUser() {}
      }

      class Editor extends User {
        constructor(name) {
          super(name, "editor", ["home", "page-manager"]);
        }

        dataShow() {
          console.log("This is editor");
        }
      }

      // 获取类的抽象工厂方法
      function getAbstractUserFactory(role) {
        switch (role) {
          case "superadmin":
            return SuperAdmin;
          case "admin":
            return Admin;
          case "editor":
            return Editor;
          default:
            throw new Error("传入角色有误！");
        }
      }

      // 根据传参，获取对应的实现类
      let UserClass = getAbstractUserFactory("superadmin");
      // 再通过实现类，获取到对应实例对象
      let user = new UserClass("zhangsan");

      console.log(user);
    </script>
  </body>
</html>
